<template>
  <div class="app-container">
    
    <el-tabs v-model="activeName"  @tab-click="handleClick">
        <el-tab-pane label="全部" name="all">
            <civil-card></civil-card>
            <disability></disability>
            <live-build></live-build>
            <judicial></judicial>
            <health></health>
            <human-society></human-society>
        </el-tab-pane>
        <el-tab-pane label="民政业务" name="civil">
          <civil-card></civil-card>
        </el-tab-pane>
        <el-tab-pane label="残联业务" name="disability">
          <disability></disability>
        </el-tab-pane>
        <el-tab-pane label="住建业务" name="liveBuild">
          <live-build></live-build>
        </el-tab-pane>
        <el-tab-pane label="司法业务" name="judicial">
          <judicial></judicial>
        </el-tab-pane>
        <el-tab-pane label="卫计业务" name="health">
          <health></health>
        </el-tab-pane>
        <el-tab-pane label="人社业务" name="humanSociety">
          <human-society></human-society>
        </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import CivilCard from "./components/CivilCard";
import Disability from "./components/Disability";
import LiveBuild from "./components/LiveBuild";
import Judicial from "./components/Judicial";
import HumanSociety from "./components/HumanSociety";
import Health from "./components/Health";

export default {
  data() {
    return {
      activeName: "all"
    };
  },
  components: {
    CivilCard,
    Disability,
    LiveBuild,
    HumanSociety,
    Judicial,
    Health
  },
  methods: {
    handleClick(tab, event) {
      //console.log(tab, event);
    }
  }
};
</script>

